<template>
<div class="contain">
  <div class="loader-base" v-if="showLoad"><div class="loader-wrap"></div></div>
  <header class="hd-top">
    <span class="iconfont icon-left" @click="goBack"></span>
    <h2 class="title">配送员列表</h2>
  </header>
  <div class="page">
    <div class="displayflex driver-list-top ft14 gray">
      <label>
        <input type="checkbox" class="list-radio-check" @change="selectAll" v-model="checkBtn">
        <span class="list-radio-circle"></span>
        <em class="txt">全选</em>
      </label>
      <div class="flex1 txt-rit">已选择<em class="org">{{driverArr.length}}</em>位配送员</div>
    </div>
    <div class="list-warp" v-for="item in todolist">
      <div class="list-driver displayflex mb20">
        <label class="label">
          <input type="checkbox" class="list-radio-check" v-model="driverArr" :value="item">
          <span class="list-radio-circle"></span>
        </label>
        <div class="pic"><img src="~images/icon/people-ico.png"></div>
        <div class="flex1 driver">
          <span class="name ft17" v-if="item.Name == item.MobileNo">{{item.Name}}</span>
          <span class="name ft17" v-else>{{item.Name}} {{item.MobileNo}}</span>
          <p class="ft14">提货准点率：<span class="org">{{item.PickUpOTRate}}</span></p>
          <p class="ft14">送达准点率：<span class="org">{{item.SendOTRate}}</span></p>
        </div>
      </div>
      <p class="red driver-num" style="font-size:0px">
        <span class="ft14" v-if="item.awaitPickUpCount > 0 || item.SendingCount  > 0">已有</span>
        <span class="ft14" v-if="item.awaitPickUpCount > 0">待提货订单{{item.awaitPickUpCount}}笔</span>
        <span class="ft14" v-if="item.awaitPickUpCount > 0 && item.SendingCount  > 0">，</span>
        <span class="ft14" v-if="item.SendingCount > 0">配送中订单{{item.SendingCount}}笔</span>
      </p>
    </div>
    <div class="noDate_page" v-if="todolist.length<=0">
      <div class="noDate_icon"><i class="iconfont icon-null"></i></div>
      未找到相关数据
    </div>
  </div>
  <div class="btn-double displayflex">
    <div class="flex1" @click="submit()">确定</div>
  </div>
</div>
</template>

<script>
export default {
  data() {
    return {
      todolist: [],
      showLoad: false,
      selectDriverData: [],
      driverArr: [],
      checkBtn: false
    };
  },
  computed: {
    userinfo() {
      if (localStorage.UserInfo) {
        return JSON.parse(localStorage.UserInfo);
      }
    },
    bbillguid() {
      return this.$route.query.BBillGuid;
    }
  },
  created() {
    this.getData();
  },
  watch: {
    driverArr(val) {
      if (this.todolist.length == val.length) {
        this.checkBtn = true;
      } else {
        this.checkBtn = false;
      }
    }
  },
  methods: {
    goBack() {
      this.$router.go(-1);
    },
    getData() {
      this.showLoad = true;
      var self = this;
      var query = {
        CorpGuid: "",
        BBillGuid: self.bbillguid,
        UserBizType: "Driver"
      };
      this.Ajax.post("SearchDriverInfo", query).then(function(resp) {
        self.showLoad = false;
        if (resp.IsSuccess) {
          self.todolist = resp.Datas;
        }
      });
    },
    selectAll() {
      if (this.checkBtn) {
        this.driverArr = [];
        for (var k = 0; k < this.todolist.length; k++) {
          this.driverArr.push(this.todolist[k]);
        }
      } else {
        this.checkBtn = false;
        this.driverArr = [];
      }
    },
    submit() {
      var self = this;
      self.showLoad = true;
      var guid = self.$route.query.BBillGuid;
      var billno = self.$route.query.BBillNo;
      if (self.driverArr.length == 0) {
        self.$vux.toast.show({
          type: "warn", //success, warn, cancel, text
          text: "请选择配送员！"
        });
        self.showLoad = false;
        return false;
      }
      if (sessionStorage.selectDataOrder) {
        //self.showLoad = false;
        self.submitMax();
      } else {
        var query = {
          BBillNo: billno,
          BBillGuid: guid,
          mfDriver: self.driverArr
        };
        self.Ajax.post("CheckedDriver", query).then(function(resp) {
          self.showLoad = false;
          if (resp.IsSuccess) {
            sessionStorage.clear();
            self.$router.push({
              path: "/operation"
            });
            self.$vux.toast.show({
              type: "success", //success, warn, cancel, text
              text: "配送员指定成功",
              onHide() {}
            });
          } else {
            self.$vux.toast.show({
              type: "warn", //success, warn, cancel, text
              text: resp.ErrorMessage
            });
          }
        });
      }
    },
    submitMax() {
      var self = this;
      //self.showLoad = true;
      //return false;
      var orderlist = JSON.parse(sessionStorage.selectDataOrder);
      var query = {
        TrtplpomainModel: orderlist,
        MfstaffModel: self.driverArr
      };
      self.Ajax.post("CheckedDriverList", query).then(function(resp) {
        if (resp.IsSuccess) {
          sessionStorage.clear();
          self.showLoad = false;
          self.$router.push({
            path: "/operation"
          });
          self.$vux.toast.show({
            type: "success", //success, warn, cancel, text
            text: "配送员指定成功",
            onHide() {}
          });
        } else {
          self.showLoad = false;
          self.$vux.toast.show({
            type: "warn", //success, warn, cancel, text
            text: resp.ErrorMessage
          });
        }
      });

      //self.showLoad = false;
    }
  }
};
</script>